import { avatarUri } from '@/constants/Uri'
import dayjs from 'dayjs'
import React, { useRef, useEffect, useState } from 'react'
import {
  StyleSheet,
  View,
  requireNativeComponent,
  ViewProps,
  findNodeHandle,
  UIManager
} from 'react-native'

type NativeInfoViewType = ViewProps

const originViewName = 'nativeInfoViewGroup' // 名字来源于原生java
const NativeInfoViewGroup =
  requireNativeComponent<NativeInfoViewType>(originViewName)

export default () => {
  const ref = useRef(null)
  const timeRef = useRef<Number>(null)
  const [desc, setdesc] = useState('其它几个都是在原生注册了的props？？？')
  const [nowTime, setnowTime] = useState('')
  useEffect(() => {
    timeRef!.current = setInterval(() => {
      setdesc(Math.random().toFixed(3) + 'style是从ViewProps中继承过来的')
    }, 2000)

    setTimeout(() => {
      timeRef.current && clearInterval(timeRef.current)
    }, 12000)
  }, [])

  // 可以实时变动原生的DOM
  useEffect(() => {
    return () => {}
  }, [])

  useEffect(() => {}, [])

  // style是从ViewProps中继承过来的 ,而其它几个都是在原生注册了的props
  return <NativeInfoViewGroup ref={ref} style={styles.infoView} />
}

const styles = StyleSheet.create({
  infoView: {
    width: '100%',
    height: 120,
    backgroundColor: 'blue'
  },
})
